<template>
	<u-tabbar :value="index" @change="tabbarChange" :fixed="true" :placeholder="false" activeColor="#d81e06" :safeAreaInsetBottom="true">
		<u-tabbar-item v-for="(item, index) in list" :key="index" :text="item.text" :icon="item.icon"></u-tabbar-item>
	</u-tabbar>
</template>

<script>
export default {
	data() {
		return {
			list: [
				{ text: '首页', pagePath: '/pages/index/index', icon: 'home' },
				{ text: '专题', pagePath: '/pages/topic/topic', icon: 'file-text' },
				{ text: '分类', pagePath: '/pages/category/category', icon: 'grid' },
				{ text: '购物车', pagePath: '/pages/cart/cart', icon: 'shopping-cart' },
				{ text: '我的', pagePath: '/pages/user/user', icon: 'account' }
			]
		};
	},
	computed: {
		index() {
			return this.$store.state.tabbarIndex;
		}
	},
	methods: {
		tabbarChange(index) {
			uni.switchTab({
				url: this.list[index].pagePath
			});
		}
	}
};
</script>
